import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:tiktokadult/assets_tool/images.dart';
import 'package:tiktokadult/hj_page/home_business/search_page/search_main_logic.dart';
import 'package:tiktokadult/hj_utils/widget_utils.dart';

import '../../../tools_base/indicator/custom_tab_indicator.dart';
import '../../home_business/search_page/search_main_page.dart';
import '../blog_add_page.dart';
import '../short_video_main_logic.dart';

class ShortTopMenu extends StatefulWidget {
  final TabController? tabController;

  const ShortTopMenu({
    super.key,
    this.tabController,
  });

  @override
  State<StatefulWidget> createState() {
    return _ShortTopMenuState();
  }
}

class _ShortTopMenuState extends State<ShortTopMenu> {
  ShortVideoMainLogic get logic => Get.find<ShortVideoMainLogic>();

  @override
  void initState() {
    super.initState();
    widget.tabController?.addListener(() {
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Obx(
      () => Visibility(
        visible: logic.tabIndexState.value == 0 || logic.tabIndexState.value == 2 || logic.isMenuShowState.value,
        child: Container(
          height: kToolbarHeight,
          padding: EdgeInsets.symmetric(horizontal: 12),
          child: Row(
            children: [
              InkWell(
                onTap: () => Get.to(BlogAddPage()),
                child: Container(
                  padding: EdgeInsets.only(bottom: 2),
                  child: Image.asset(
                    'add_circle.webp'.videoPath,
                    width: 24,
                    color: Colors.white,
                  ),
                ),
              ),
              Expanded(
                child: TabBar(
                  indicator: BoxDecoration(), //CustomIndicator(width: 14, height: 3, color: Color(0xffDB361F)),
                  labelColor: Colors.white.withOpacity(0.9),
                  labelStyle: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.w600,
                  ),
                  unselectedLabelColor: Colors.white.withOpacity(0.35),
                  unselectedLabelStyle: TextStyle(fontSize: 16),
                  labelPadding: EdgeInsets.zero,
                  controller: widget.tabController,
                  isScrollable: true,
                  tabAlignment: TabAlignment.center,
                  tabs: List.generate(logic.typesMenu.length, (index) {
                    return _buildMenuItem(logic.typesMenu[index], logic.tabIndexState.value == index);
                  }).toList(),
                ),
              ),
              InkWell(
                onTap: () => Get.to(SearchMainPage()),
                child: Container(
                  padding: EdgeInsets.only(bottom: 2),
                  child: Image.asset(
                    'search_icon.png'.commonImgPath,
                    width: 24,
                    color: Colors.white,
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildMenuItem(String title, bool isSelected) {
    return Container(
      padding: const EdgeInsets.only(left: 14, right: 14),
      child: Text(title),
    );
  }

  @override
  void dispose() {
    super.dispose();
  }
}
